<template>
  <div>
    <el-tabs
    class="main" v-model="activeName">
      <el-tab-pane label="会议室申请" name="RoomApply">
        <room-apply/>
      </el-tab-pane>
      <el-tab-pane label="我的申请" name="MyRoomApply">
        <my-room-apply/>
      </el-tab-pane>
       <el-tab-pane label="申请审批" name="ApplyCheck" v-if="role === 1">
         <!-- 由人事主管审批 只有人事开放 -->
         <to-apply/>
      </el-tab-pane>

    </el-tabs>
  </div>
</template>

<script>
import RoomApply from './components/RoomApply.vue'
import MyRoomApply from "./components/MyRoomApply";
import ToApply from "./components/ToApply";
export default {
  components: {ToApply, MyRoomApply, RoomApply },
  name: "ProHome",
  data(){
    return {
       activeName:'RoomApply',
       userInfo: JSON.parse(sessionStorage.getItem('userInfo')),
       role:0,
    }
  },
  methods:{
    checkRoles(roles){
       roles.map(item => {
        if(item.id == 9 || item.id == 6){
            this.role = 1;
            return;
        }
      })
    }
  },
  mounted(){
    // 检查权限
    this.checkRoles(this.userInfo.roles);
  }
}
</script>

<style scoped>

</style>>

</style>
